<%--
  Created by IntelliJ IDEA.
  film: huangrulan
  Date: 2019/3/5
  Time: 8:40 AM
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<html>
<head>
    <meta charset="utf-8">
    <title>影片信息</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="Author" content="larry"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="${base}/assets/images/favicon.ico">
    <link rel="stylesheet" type="text/css" href="${base}/assets/css/layui/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="${base}/assets/css/larryms/larryms.css" media="all">
    <link rel="stylesheet" type="text/css" href="${base}/larryms/css/admin/admin.css" media="all">
    <link rel="stylesheet" type="text/css" href="${base}/larryms/css/admin/article.css" media="all">
    <style>
        html, body {
            margin: 0px;
            padding: 0px;
            width: 100%;
            height: 100%;
            background: #ffffff;
            overflow: auto;
        }
        .layui-input-block {
            margin-left: 140px;
            min-height: 36px;
        }
    </style>
</head>
<body class="larryms-system article" style="background-color: #ffffff;">
<div class="layui-fluid larryms-article">
    <div class="layui-tab-content larryms-panel-body">
        <fieldset class="layui-elem-field layui-field-title">
            <legend><c:if test="${flag == 1}">新增影片</c:if></legend>
            <legend><c:if test="${flag == 2}">编辑影片</c:if></legend>
            <legend><c:if test="${flag == 3}">影片详情</c:if></legend>
            <div class="layui-field-box">
                <form id="userForm" class="layui-form"
                      action="${base}/ticket/film/save.json" enctype="multipart/form-data" method="post">
                    <input type="hidden" name="id" value="${film.id}">
                    <div class="layui-form-item">
                        <label class="layui-form-label"><font color="red">* </font>名称</label>
                        <div class="layui-input-block">
                            <input type="text" name="title" value="${film.title}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off" lay-verify="required">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-block">
                            <label class="layui-form-label"><font color="red">* </font>封面图片</label>
                            <div class="layui-input-block">
                                <button type="button" class="layui-btn" id="pushPic" <c:if test="${flag == 3}">disabled</c:if>>
                                    <i class="layui-icon">&#xe67c;</i>上传图片
                                </button>
                                <div class="layui-upload-list">
                                    <img src="${film.briefPic}" id="pic" style="width:200px;height:275px;<c:if test="${film.briefPic==null}">display: none;</c:if>">
                                </div>
                                <input type="hidden" name="briefPic">
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><font color="red">* </font>简介</label>
                        <div class="layui-input-block">
                            <input type="text" name="description" value="${film.description}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off" lay-verify="required">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">主演</label>
                        <div class="layui-input-block">
                            <input type="text" name="performer" value="${film.performer}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><font color="red">* </font>类型</label>
                        <div class="layui-input-block">
                            <c:if test="${flag != 3}">
                                <c:forEach items="${types}" var="type">
                                    <input type="checkbox" name="kinds" title="${type}" value="${type}"
                                           <c:if test="${fn:contains(film.kind.toString(), type.toString())}">checked=""</c:if>>
                                </c:forEach>
                                <input type="hidden" name="kind" value="${film.kind}">

                            </c:if>
                            <c:if test="${flag == 3}">
                                <input type="text" name="kind" value="${film.kind}" disabled
                                       class="layui-input larry-input" autocomplete="off">
                            </c:if>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label"><font color="red">* </font>维度</label>
                        <div class="layui-input-inline">
                            <c:if test="${flag != 3}">
                                <select name="dimension">
                                    <option value="2" <c:if test="${order.status == 2}">selected</c:if>>2D</option>
                                    <option value="3" <c:if test="${order.status == 3}">selected</c:if>>3D</option>
                                    <option value="4" <c:if test="${order.status == 4}">selected</c:if>>4D</option>
                                </select>
                            </c:if>
                            <c:if test="${flag == 3}">
                                <input type="text" name="dimension" value="${film.dimension}D" disabled
                                       class="layui-input larry-input" autocomplete="off" lay-verify="number|required">
                            </c:if>
                        </div>

                        <label class="layui-form-label"><font color="red">* </font>时长</label>
                        <div class="layui-input-inline">
                            <input type="text" name="duration" value="${film.duration}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off" lay-verify="number|required">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">上映时间</label>
                        <div class="layui-input-inline">
                            <input type="text" name="publish" value="${film.publish}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input date-item" autocomplete="off" placeholder="请输入影片上映时间">
                        </div>

                        <label class="layui-form-label">开影时间</label>
                        <div class="layui-input-inline">
                            <input type="text" name="online" value="${film.online}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input date-item" autocomplete="off" placeholder="请选择影院上线时间">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">销售量</label>
                        <div class="layui-input-inline">
                            <input type="text" name="sales" value="${film.sales}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off" lay-verify="number">
                        </div>
                        <label class="layui-form-label">想看的人</label>
                        <div class="layui-input-inline">
                            <input type="text" name="favor" value="${film.favor}" <c:if test="${flag == 3}">disabled</c:if>
                                   class="layui-input larry-input" autocomplete="off" lay-verify="number">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">备注</label>
                        <div class="layui-input-block">
                            <textarea name="remark" class="layui-textarea larry-textarea" <c:if test="${flag == 3}">disabled</c:if>
                                      autocomplete="off">${film.remark}</textarea>
                        </div>
                    </div>
                    <div style="display: inline-block; width: 100%; text-align: center;<c:if test="${flag == 3}">display: none;</c:if>">
                        <a class="layui-btn" lay-submit lay-filter="saveFilm" id="submitAdd">确定</a>
                        <a class="layui-btn layui-btn-normal" id="resetAdd">重置</a>
                        <a class="layui-btn layui-btn-danger" id="closeAdd">关闭</a>
                    </div>
                </form>
            </div>
        </fieldset>
    </div>
</div>

<!-- 加载js文件-->
<script type="text/javascript" src="${base}/assets/js/layui/layui.js"></script>
<script type="text/javascript">
    layui.config({
        version: "2.0.8",
        base: '${base}/larryms/',  //实际使用时，建议改成绝对路径
        identified: 'merge',
        // mods: 'vip/',
        page: 'film',
        layertype: 2,
        rightMenu: true // false关闭，设置为custom时使用自定义，不使用默认menu
    }).extend({
        larry: 'js/base'
    }).use(['larry', 'form', 'layer', 'laydate', 'table', 'upload'], function () {
        var $ = layui.$,
            larry = layui.larry, layer = layui.layer, form = layui.form, laydate = layui.laydate, table = layui.table, upload = layui.upload;
        var curIfr = parent.layer.getFrameIndex(window.name);
        $('#resetAdd').on('click', function () {
            $('#slideForm')[0].reset();
        });
        $('#closeAdd').on('click', function () {
            parent.layer.close(curIfr);
        });

        //日期时间选择器
        $('.date-item').each(function(){
            laydate.render({
                elem: this
                ,format:'yyyy-MM-dd HH:mm:ss'
                ,type:'datetime'
                ,trigger: 'click'
            });
        });
        //赋值type
        form.on('checkbox', function (data) {
            var kindStr = "";
            var value = data.value;
            $("input[name=kinds]:checked").each(function () {
                kindStr += $(this).val() + ",";
            });
            console.log("kindStr=" + kindStr);
            kindStr = kindStr.substr(0, kindStr.length - 1);
            $('input[name=kind]').val(kindStr);
        });
        //上传图片
        var uploadInst = upload.render({
            elem: '#pushPic'
            , url: "${base}/ticket/upload/image.json"
            , size: 500
            , choose: function (obj) {
                //预读本地文件示例，不支持ie8
                obj.preview(function (index, file, result) {
                    $('#pic').attr('src', result); //图片链接（base64）
                    $('#pic').show();
                });
            }
            , done(res, index, upload) {
                $('input[name=briefPic]').val(res.data);
                console.log(res.data);
            }
            , error: function (index, upload) {
                layer.msg('电影封面保存失败', {icon: 5, time: 2000}, function () {
                });
            }
        });
        //提交表单
        form.on('submit(saveFilm)', function (data) {
            console.log(data.field);
            $.ajax({
                type: 'POST',
                url: '${base}/ticket/film/save.json',
                dataType: 'json',
                data: data.field,
                async: true,
                success: function (res) {
                    layer.msg('这里是msg内容');
                    console.log(res.success);
                    if (res.success) {
                        layer.msg(res.data, {icon: 1, time: 1500}, function () {
                            parent.layer.close(curIfr);
                            parent.location.href = "film.page";
                        });
                    } else {
                        layer.msg(res.msg, {icon: 5, time: 2000}, function () {
                            parent.layer.close(curIfr);
                            location.reload();
                        });
                    }
                }, error: function () {
                    layer.msg("请求失败，请联系开发人员", {icon: 5, time: 2000}, function () {
                        parent.layer.close(curIfr);
                        location.reload();
                    });
                }
            });
        });
    });
</script>
</body>
</html>
